﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>可视化报表系统</title>
    <link href="~/layuiadmin/layui/css/layui.css" rel="stylesheet" />
    <link href="~/css/main.min.css" asp-append-version="true" rel="stylesheet" />
    <script src="~/js/Th/echarts.min.js"></script>
    <link href="~/css/thcss/style.css" type="text/css" media="all" rel="stylesheet" />
</head>
<body>
    <div class="main">
        <div class="nav">
            <div class="nav-header">
                <a href="@Url.Action("Index", "Home")" class="nav-header-brand">
                </a>
            </div>
            <div class="nav-time">
                <span title="菜单">
                    <i class="layui-icon layui-icon-shrink-right"></i>
                </span>
                <span title="全屏">
                    <i class="layui-icon layui-icon-screen-full"></i>
                </span>
                <span>
                    <i class="layui-icon layui-icon-user"></i>
                    @User.Identity.Name !
                </span>
                <span>
                    当前时间：@DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss")
                </span>
            </div>
            <div class="nav-title">
                <p class="tith1" align="center">报表</p>
            </div>
            <div class="nav-menu layui-hide">
                <div class="user">
                    <p>@User.Identity.Name !</p>
                    <p>
                        <a class="layui-btn layui-btn-primary" href="@Url.Action("OnReport", "Home")">上一页</a>
                        <a class="layui-btn layui-btn-primary" href="@Url.Action("ThReport", "Home")">下一页</a>
                    </p>
                    <p>
                        <a class="layui-btn layui-btn-primary" href="@Url.Action("Back", "Home")">进入后台</a>
                        <a class="layui-btn layui-btn-primary" href="@Url.Action("Logout", "Account")">安全退出</a>
                    </p>
                </div>
                <fieldset class="layui-elem-field layui-field-title">
                    <legend>主题切换</legend>
                </fieldset>
                <div class="theme">
                    <div class="layui-row"></div>
                </div>
            </div>
        </div>
        <div class="content">
            <div class="left1 pleft1">
                <div class="lefttime">
                    <h2 class="tith2">统计时间</h2>
                    <div class="lefttime_text">
                        <ul>
                            <li class="bg active">今日</li>
                            <li></li>
                            <li class="bg">本周</li>
                            <li></li>
                            <li class="bg">本月</li>
                            <li></li>
                            <li class="bg">本季</li>
                            <li></li>
                            <li class="bg">本年</li>
                        </ul>
                    </div>
                </div>
                <div class="plefttoday">
                    <h2 class="tith2">小标题统计</h2>
                    <div class="lefttoday_tit" style=" height:8%"><p class="fl">分类：内容</p><p class="fr">2018-06-14</p></div>
                    <div class="lefttoday_number">
                        <div class="widget-inline-box text-center fl">
                            <p>内容总数</p>
                            <h3 class="ceeb1fd">54</h3>
                            <h4 class="text-muted">环比<img src="~/imgs/th/iconup.png" height="16" />2%</h4>
                        </div>
                        <div class="widget-inline-box text-center fl">
                            <p>内容1</p>
                            <h3 class="c24c9ff">54</h3>
                            <h4 class="text-muted">环比<img src="~/imgs/th/icondown.png" height="16" />3%</h4>
                        </div>
                        <div class="widget-inline-box text-center fl">
                            <p>内容2</p>
                            <h3 class="cffff00">4</h3>
                            <h4 class="text-muted">环比<img src="~/imgs/th/icondown.png" height="16" />3%</h4>
                        </div>
                        <div class="widget-inline-box text-center fl">
                            <p>其他内容</p>
                            <h3 class="c11e2dd">4</h3>
                            <h4 class="text-muted">环比<img src="~/imgs/th/icondown.png" height="16" />3%</h4>
                        </div>
                    </div>
                    <!-- lefttoday_number end -->
                    <!--  lefttoday_bar end-->
                </div>
                <div class="lpeftmidbot">
                    <h2 class="tith2">内容占比</h2>
                    <div id="lpeftbot" class="lpeftmidbotcont"></div>
                </div>
                <div class="lpeftbot">
                    <h2 class="tith2">内容分析</h2>
                    <div id="lpeftmidbot" class="lpeftbotcont"></div>
                </div>
            </div>
            <!--  left1 end -->
            <div class="left2">
                <div class="pleftbox2top">
                    <h2 class="tith2">内容分类分析</h2>
                    <div id="pleftbox2top" class="pleftbox2topcont"></div>
                </div>
                <div class="pleftbox2midd">
                    <h2 class="tith2">内容结构</h2>
                    <!-- <div id="pleftbox2midd" class="pleftbox2middcont"></div> -->
                    <div class="pvr fl  lpeftb2otcont1 hdtop" style=" height:82%;">
                        <ul>
                            <li class="hot1">1</li>
                            <li class="hot2">2</li>
                            <li class="hot3">3</li>
                            <li class="hot4">4</li>
                            <li class="hot5">5</li>
                        </ul>
                        <div id="pleftbox2bott_cont" class="pleftbox2middcont" style=" height:100%;"></div>
                    </div>
                </div>
                <div class="lpeft2bot">
                    <h2 class="tith2 ">内容占比TOP5</h2>
                    <div id="prbottom_box1" class="lpeftb2otcont"></div>

                </div>
            </div>
            <div class="mrbox prbox">
                <div class="hdmrbox_top">
                    <div class="mrbox_top_midd">
                        <div class="hdmrboxtm-mbox">
                            <h2 class="tith2 pt1">内容分析</h2>
                            <div class="lefttoday_tit font14" style=" height:13%"><p class="fl"><i class="ricontop redr">12</i>内容1</p><p class="fr"><i class="ricontop bluer">12</i>内容2</p></div>
                            <div id="chart_1" class="chart" style="width:100%;height:778px;"></div>
                        </div>
                    
                        <div class="mrbox_bottom_bott">
                            <div class="rbottom_box1 hdwid">
                                <h2 class="tith2">内容分类分析</h2>
                                <div id="prbottom_box2" class="prbottom_box1cont"></div>
                            </div>
                            <div class="rbottom_box2 hdwid">
                                <h2 class="tith2">内容统计</h2>
                                <div id="pleftbox2midd" class="prbottom_box1cont"></div>
                            </div>
                        </div>

                    </div>
                    <!-- mrbox_top_midd end -->
                    <div class="mrbox_top_right">
                        <div class="hdrightboxtop">
                            <h2 class="tith2">今日内容提醒</h2>
                            <div class="lefttoday_tit" style="height:4%"><p class="fl">状态：已调节</p><p class="fr">时间段：2018-06-10</p></div>
                            <div class="left2_table hdleft2_table">
                                <ul>
                                    <li>
                                        <p class="fl">
                                            <b>Aoi</b><br>
                                            机台故障。<br>
                                        </p>
                                        <p class="fr pt17">2018-06-22</p>
                                    </li>
                                    <li class="bg">
                                        <p class="fl">
                                            <b>Aoi</b><br>
                                            机台故障。<br>
                                        </p>
                                        <p class="fr pt17">2018-06-22</p>
                                    </li>
                                    <li>
                                        <p class="fl">
                                            <b>Aoi</b><br>
                                            机台故障。<br>
                                        </p>
                                        <p class="fr pt17">2018-06-22</p>
                                    </li>
                                    <li class="bg">
                                        <p class="fl">
                                            <b>Aoi</b><br>
                                            机台故障。<br>
                                        </p>
                                        <p class="fr pt17">2018-06-22</p>
                                    </li>
                                    <li>
                                        <p class="fl">
                                            <b>Aoi</b><br>
                                            机台故障。<br>
                                        </p>
                                        <p class="fr pt17">2018-06-22</p>
                                    </li>
                                    <li class="bg">
                                        <p class="fl">
                                            <b>Aoi</b><br>
                                            机台故障。<br>
                                        </p>
                                        <p class="fr pt17">2018-06-22</p>
                                    </li>
                                    <li>
                                        <p class="fl">
                                            <b>Aoi</b><br>
                                            机台故障。<br>
                                        </p>
                                        <p class="fr pt17">2018-06-22</p>
                                    </li>
                                    <li class="bg">
                                        <p class="fl">
                                            <b>Aoi</b><br>
                                            机台故障。<br>
                                        </p>
                                        <p class="fr pt17">2018-06-22</p>
                                    </li>

                                    <li>
                                        <p class="fl">
                                            <b>Aoi</b><br>
                                            机台故障。<br>
                                        </p>
                                        <p class="fr pt17">2018-06-22</p>
                                    </li>
                                    <li class="bg">
                                        <p class="fl">
                                            <b>Aoi</b><br>
                                            机台故障。<br>
                                        </p>
                                        <p class="fr pt17">2018-06-22</p>
                                    </li>
                                    <li>
                                        <p class="fl">
                                            <b>Aoi</b><br>
                                            机台故障。<br>
                                        </p>
                                        <p class="fr pt17">2018-06-22</p>
                                    </li>
                                    <li class="bg">
                                        <p class="fl">
                                            <b>Aoi</b><br>
                                            机台故障。<br>
                                        </p>
                                        <p class="fr pt17">2018-06-22</p>
                                    </li>

                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>

    </div>
    <script src="~/js/jquery-2.1.1.min.js"></script>
    <script src="~/js/echarts.min.js"></script>
    <script src="~/js/mSlider.min.js"></script>
    <script type="text/javascript">
        var myChart = echarts.init(document.getElementById('lpeftmidbot'));
        option = {
            backgroundColor: 'rgba(1,202,217,.2)',
            grid: {
                left: 50,
                right: 20,
                top: 45,
                bottom: 30
            },
            legend: {
                top: 5,
                textStyle: {
                    fontSize: 10,
                    color: 'rgba(255,255,255,.7)'
                },
                data: ['分类1', '分类2', '总数']
            },
            // toolbox: {
            //     feature: {
            //         dataView: {show: true, readOnly: false},
            //         magicType: {show: true, type: ['line', 'bar']},
            //         restore: {show: true},
            //         saveAsImage: {show: true}
            //     }
            // },
            // legend: {
            //   top:10,
            //   left:10,
            //   textStyle:{
            //     fontSize: 10,
            //     color:'rgba(255,255,255,.7)'
            //   },
            //     data:['男','女','总数']
            // },
            xAxis: [
                {
                    type: 'category',
                    axisLine: {
                        lineStyle: {
                            color: 'rgba(255,255,255,.2)'
                        }
                    },
                    splitLine: {
                        lineStyle: {
                            color: 'rgba(255,255,255,.1)'
                        }
                    },
                    axisLabel: {
                        color: "rgba(255,255,255,.7)"
                    },

                    data: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12'],
                    axisPointer: {
                        type: 'shadow'
                    }
                }
            ],
            yAxis: [
                {
                    type: 'value',
                    name: '',
                    min: 0,
                    max: 250,
                    interval: 50,
                    axisLine: {
                        lineStyle: {
                            color: 'rgba(255,255,255,.3)'
                        }
                    },
                    splitLine: {
                        lineStyle: {
                            color: 'rgba(255,255,255,.01)'
                        }
                    },

                    axisLabel: {
                        formatter: '{value}'
                    }
                }

            ],
            series: [
                {
                    name: '分类1',
                    type: 'bar',
                    itemStyle: {
                        normal: {
                            color: '#00a0e9'
                            // color: new echarts.graphic.LinearGradient(
                            //     0, 0, 0, 1,
                            //     [
                            //         {offset: 0, color: '#b266ff'},
                            //         {offset: 1, color: '#121b87'}
                            //     ]
                            // )
                        }
                    },
                    data: [2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3]
                },
                {
                    name: '分类2',
                    type: 'bar',
                    itemStyle: {
                        normal: {
                            color: '#fff799'
                            // color: new echarts.graphic.LinearGradient(
                            //     0, 0, 0, 1,
                            //     [
                            //         {offset: 0, color: '#00f0ff'},
                            //         {offset: 1, color: '#032a72'}
                            //     ]
                            // )
                        }
                    },
                    data: [2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3]
                },
                {
                    name: '总数',
                    type: 'bar',
                    itemStyle: {
                        normal: {
                            color: '#6fcc8c'
                            // color: new echarts.graphic.LinearGradient(
                            //     0, 0, 0, 1,
                            //     [
                            //         {offset: 0, color: '#fffb34'},
                            //         {offset: 1, color: '#032a72'}
                            //     ]
                            // )
                        }
                    },
                    data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2]
                }
            ]
        };
        myChart.setOption(option);
    </script>

    <script type="text/javascript">
        var myChart = echarts.init(document.getElementById('lpeftbot'));
        option = {
            color: ['#00b7ee', '#f8e19a', '#f19ec2', '#5ebbeb', '#d16ad8', '#f8e19a', '#00b7ee', '#81dabe', '#5fc5ce'],
            backgroundColor: 'rgba(1,202,217,.2)',
            grid: {
                left: 20,
                right: 20,
                top: 0,
                bottom: 20
            },
            legend: {
                top: 10,
                textStyle: {
                    fontSize: 10,
                    color: 'rgba(255,255,255,.7)'
                },
                data: ['分类1', '分类2', '其他分类']
            },
            series: [
                {
                    name: '访问来源',
                    type: 'pie',
                    radius: '55%',
                    center: ['50%', '55%'],
                    data: [
                        { value: 335, name: '分类1' },
                        { value: 310, name: '分类2' },
                        { value: 370, name: '其他分类' }

                    ],
                    itemStyle: {
                        emphasis: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    }
                }
            ]
        };
        myChart.setOption(option);
    </script>
    <script type="text/javascript">
        var myChart = echarts.init(document.getElementById('pleftbox2top'));
        option = {
            color: ['#d2d17c', '#00b7ee', '#5578cf', '#5ebbeb', '#d16ad8', '#f8e19a', '#00b7ee', '#81dabe', '#5fc5ce'],
            backgroundColor: 'rgba(1,202,217,.2)',
            grid: {
                left: 20,
                right: 20,
                top: 0,
                bottom: 20
            },
            legend: {
                top: 10,
                textStyle: {
                    fontSize: 10,
                    color: 'rgba(255,255,255,.7)'
                },
                data: ['分类1', '分类2', '分类3', '分类4', '分类5']
            },
            series: [
                {
                    name: '访问来源',
                    type: 'pie',
                    radius: '55%',
                    center: ['50%', '55%'],
                    data: [
                        { value: 335, name: '分类1' },
                        { value: 310, name: '分类2' },
                        { value: 234, name: '分类3' },
                        { value: 135, name: '分类4' },
                        { value: 158, name: '分类5' }

                    ],
                    itemStyle: {
                        emphasis: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    }
                }
            ]
        };
        myChart.setOption(option);
    </script>
    <script type="text/javascript">
        var myChart = echarts.init(document.getElementById('pleftbox2midd'));
        option = {
            color: ['#f8e19a', '#00b7ee', '#5578cf', '#5ebbeb', '#d16ad8', '#f8e19a', '#00b7ee', '#81dabe', '#5fc5ce'],
            backgroundColor: 'rgba(1,202,217,.2)',
            grid: {
                left: 20,
                right: 20,
                top: 0,
                bottom: 20
            },
            legend: {
                top: 10,
                textStyle: {
                    fontSize: 10,
                    color: 'rgba(255,255,255,.7)'
                },
                data: ['分类1', '分类2']
            },
            series: [
                {
                    name: '访问来源',
                    type: 'pie',
                    radius: '55%',
                    center: ['50%', '65%'],
                    data: [
                        { value: 335, name: '分类1' },
                        { value: 310, name: '分类2' }
                    ],
                    itemStyle: {
                        emphasis: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        }
                    }
                }
            ]
        };
        myChart.setOption(option);
    </script>
    <script type="text/javascript">
        var myChart = echarts.init(document.getElementById('pmrboxbottom'));
        option = {
            color: ['#d2d17c', '#00b7ee', '#5578cf', '#5ebbeb', '#d16ad8', '#f8e19a', '#00b7ee', '#81dabe', '#5fc5ce'],
            backgroundColor: 'rgba(1,202,217,.2)',
            legend: {
                top: 10,
                textStyle: {
                    fontSize: 10,
                    color: 'rgba(255,255,255,.7)'
                },
                data: ['分类1', '分类2', '分类3', '分类4', '分类5', '分类6', '分类7']
            },
            grid: {
                left: 10,
                right: 10,
                top: 40,
                bottom: 10,
                containLabel: true
            },

            xAxis: [
                {
                    type: 'category',
                    axisLine: {
                        lineStyle: {
                            color: 'rgba(255,255,255,.3)'
                        }
                    },
                    splitLine: {
                        lineStyle: {
                            color: 'rgba(255,255,255,.01)'
                        }
                    },
                    data: ['类型1', '类型2', '类型3', '类型4', '类型5', '类型6', '类型7', '类型8', '类型9', '类型10', '类型11', '类型12']
                }
            ],
            yAxis: [
                {
                    axisLine: {
                        lineStyle: {
                            color: 'rgba(255,255,255,.3)'
                        }
                    },
                    splitLine: {
                        lineStyle: {
                            color: 'rgba(255,255,255,.01)'
                        }
                    },

                    axisLabel: {
                        formatter: '{value} ml'
                    },
                    type: 'value'
                }

            ],
            series: [

                {
                    name: '分类1',
                    type: 'bar',
                    barWidth: 30,
                    stack: '搜索引擎',
                    data: [620, 732, 701, 734, 1090, 1130, 1120, 620, 732, 701, 734, 1090,]
                },
                {
                    name: '分类2',
                    type: 'bar',
                    stack: '搜索引擎',
                    data: [120, 132, 101, 134, 290, 230, 220, 101, 134, 290, 230, 220]
                },
                {
                    name: '分类3',
                    type: 'bar',
                    stack: '搜索引擎',
                    data: [60, 72, 71, 74, 190, 130, 110, 71, 74, 190, 130, 110]
                },
                ,
                {
                    name: '分类4',
                    type: 'bar',
                    stack: '搜索引擎',
                    data: [120, 132, 101, 134, 290, 230, 220, 101, 134, 290, 230, 220]
                },
                {
                    name: '分类5',
                    type: 'bar',
                    stack: '搜索引擎',
                    data: [60, 72, 71, 74, 190, 130, 110, 71, 74, 190, 130, 110]
                },
                {
                    name: '分类6',
                    type: 'bar',
                    stack: '搜索引擎',
                    data: [60, 72, 71, 74, 190, 130, 110, 71, 74, 190, 130, 110]
                },
                {
                    name: '分类7',
                    type: 'bar',
                    stack: '搜索引擎',
                    data: [62, 82, 91, 84, 109, 110, 120, 91, 84, 109, 110, 120]
                }
            ]
        };
        myChart.setOption(option);
    </script>
    <script type="text/javascript">
        var myChart = echarts.init(document.getElementById('pleftbox2bott_cont'));
        option = {
            color: ['#7ecef4'],
            backgroundColor: 'rgba(1,202,217,.2)',
            grid: {
                left: 40,
                right: 20,
                top: 30,
                bottom: 0,
                containLabel: true
            },

            xAxis: {
                type: 'value',
                axisLine: {
                    lineStyle: {
                        color: 'rgba(255,255,255,0)'
                    }
                },
                splitLine: {
                    lineStyle: {
                        color: 'rgba(255,255,255,0)'
                    }
                },
                axisLabel: {
                    color: "rgba(255,255,255,0)"
                },
                boundaryGap: [0, 0.01]
            },
            yAxis: {
                type: 'category',
                axisLine: {
                    lineStyle: {
                        color: 'rgba(255,255,255,.5)'
                    }
                },
                splitLine: {
                    lineStyle: {
                        color: 'rgba(255,255,255,.1)'
                    }
                },
                axisLabel: {
                    color: "rgba(255,255,255,.5)"
                },
                data: ['分类1', '分类2', '分类3', '分类4', '分类5']
            },
            series: [
                {
                    name: '2011年',
                    type: 'bar',
                    barWidth: 20,
                    itemStyle: {
                        normal: {
                            color: new echarts.graphic.LinearGradient(
                                1, 0, 0, 1,
                                [
                                    { offset: 0, color: 'rgba(230,253,139,.7)' },
                                    { offset: 1, color: 'rgba(41,220,205,.7)' }
                                ]
                            )
                        }
                    },
                    data: [18203, 23489, 29034, 104970, 131744]
                }
            ]
        };
        myChart.setOption(option);
    </script>
    <script type="text/javascript">
        var myChart = echarts.init(document.getElementById('prbottom_box1'));
        option = {
            color: ['#d2d17c', '#7fd7b1', '#5578cf', '#5ebbeb', '#d16ad8', '#f8e19a', '#00b7ee', '#81dabe', '#5fc5ce'],
            backgroundColor: 'rgba(1,202,217,.2)',
            grid: {
                left: 20,
                right: 30,
                top: 0,
                bottom: 20
            },
            legend: {
                top: 5,

                textStyle: {
                    fontSize: 10,
                    color: 'rgba(255,255,255,.6)'
                },
                data: ['分类1', '分类2', '总数']
            },
            grid: {
                left: 20,
                right: 30,
                top: 40,
                bottom: 10,
                containLabel: true
            },
            toolbox: {
                feature: {
                    saveAsImage: {}
                }
            },
            xAxis: {
                type: 'category',
                boundaryGap: false,
                axisLine: {
                    lineStyle: {
                        color: 'rgba(255,255,255,.2)'
                    }
                },
                splitLine: {
                    lineStyle: {
                        color: 'rgba(255,255,255,.1)'
                    }
                },
                axisLabel: {
                    color: "rgba(255,255,255,.7)"
                },
                data: ['0-6', '6-18', '18-28', '28-55', '55以上']
            },
            yAxis: {
                type: 'value',
                axisLine: {
                    lineStyle: {
                        color: 'rgba(255,255,255,.2)'
                    }
                },
                splitLine: {
                    lineStyle: {
                        color: 'rgba(255,255,255,.1)'
                    }
                },
                axisLabel: {
                    color: "rgba(255,255,255,.7)"
                },
            },
            series: [
                {
                    name: '分类1',
                    type: 'line',
                    stack: '总量',
                    areaStyle: { normal: {} },
                    data: [120, 132, 101, 134, 90]
                },
                {
                    name: '分类2',
                    type: 'line',
                    stack: '总量',
                    data: [220, 182, 191, 234, 290]
                },
                {
                    name: '总数',
                    type: 'line',
                    stack: '总量',
                    data: [150, 232, 201, 154, 190]
                }
            ]
        };
        myChart.setOption(option);
    </script>
    <script type="text/javascript">
        var myChart = echarts.init(document.getElementById('prbottom_box2'));
        option = {
            backgroundColor: 'rgba(1,202,217,.2)',
            color: ['#7ecef4', '#7fd7b1'],
            grid: {
                left: 30,
                right: 20,
                top: 20,
                bottom: 40
            },
            xAxis: {
                axisLine: {
                    lineStyle: {
                        color: 'rgba(255,255,255,.7)'
                    }
                },
                splitLine: {
                    lineStyle: {
                        color: 'rgba(255,255,255,.1)'
                    }
                },
                data: ['分类1', '分类2', '分类3', '分类4', '分类5', '分类6']
            },
            yAxis: {
                axisLine: {
                    lineStyle: {
                        color: 'rgba(255,255,255,.2)'
                    }
                },
                splitLine: {
                    lineStyle: {
                        color: 'rgba(255,255,255,.1)'
                    }
                }
            },
            series: [{
                symbolSize: 20,
                data: [
                    [0.0, 8.04],
                    [2.0, 6.95],
                    [3.0, 7.58],
                    [5.0, 8.81],
                    [0.4, 8.33],
                    [4.0, 1.96],
                    [0.3, 7.24],
                    [4.6, 4.26],
                    [2.0, 4.84],
                    [2.0, 4.82],
                    [5.0, 5.68]
                ],
                type: 'scatter'
            }]
        };
        myChart.setOption(option);
    </script>

    <script type="text/javascript">
        var myChart = echarts.init(document.getElementById('prbottom_box3'));
        option = {
            backgroundColor: 'rgba(1,202,217,.2)',
            grid: {
                left: 60,
                right: 20,
                top: 40,
                bottom: 40
            },

            toolbox: {
                feature: {
                    dataView: { show: true, readOnly: false },
                    magicType: { show: true, type: ['line', 'bar'] },
                    restore: { show: true },
                    saveAsImage: { show: true }
                }
            },
            legend: {
                top: 10,
                textStyle: {
                    fontSize: 10,
                    color: 'rgba(255,255,255,.7)'
                },
                data: ['分类1', '分类2', '总数']
            },
            xAxis: [
                {
                    type: 'category',
                    axisLine: {
                        lineStyle: {
                            color: 'rgba(255,255,255,.2)'
                        }
                    },
                    splitLine: {
                        lineStyle: {
                            color: 'rgba(255,255,255,.1)'
                        }
                    },
                    axisLabel: {
                        color: "rgba(255,255,255,.7)"
                    },

                    data: ['0-6', '6-18', '18-28', '28-55', '55以上'],
                    axisPointer: {
                        type: 'shadow'
                    }
                }
            ],
            yAxis: [
                {
                    type: 'value',
                    name: '',
                    min: 0,
                    max: 250,
                    interval: 50,
                    axisLine: {
                        lineStyle: {
                            color: 'rgba(255,255,255,.3)'
                        }
                    },
                    splitLine: {
                        lineStyle: {
                            color: 'rgba(255,255,255,.01)'
                        }
                    },

                    axisLabel: {
                        formatter: '{value} ml'
                    }
                },
                {
                    type: 'value',
                    name: '',
                    max: 25,
                    interval: 5,
                    axisLine: {
                        lineStyle: {
                            color: 'rgba(255,255,255,0)'
                        }
                    },
                    splitLine: {
                        lineStyle: {
                            color: 'rgba(255,255,255,0)'
                        }
                    }
                }
            ],
            series: [

                {
                    name: '分类1',
                    type: 'bar',
                    itemStyle: {
                        normal: {
                            color: new echarts.graphic.LinearGradient(
                                0, 0, 0, 1,
                                [
                                    { offset: 0, color: '#b266ff' },
                                    { offset: 1, color: '#121b87' }
                                ]
                            )
                        }
                    },
                    data: [2.0, 4.9, 7.0, 23.2, 25.6]
                },
                {
                    name: '分类2',
                    type: 'bar',
                    itemStyle: {
                        normal: {
                            color: new echarts.graphic.LinearGradient(
                                0, 0, 0, 1,
                                [
                                    { offset: 0, color: '#00f0ff' },
                                    { offset: 1, color: '#032a72' }
                                ]
                            )
                        }
                    },
                    data: [8.6, 5.9, 9.0, 26.4, 28.7]
                },
                {
                    name: '总数',
                    type: 'bar',
                    itemStyle: {
                        normal: {
                            color: new echarts.graphic.LinearGradient(
                                0, 0, 0, 1,
                                [
                                    { offset: 0, color: '#fffb34' },
                                    { offset: 1, color: '#032a72' }
                                ]
                            )
                        }
                    },
                    yAxisIndex: 1,
                    data: [6.0, 5.2, 3.3, 4.5, 6.3]
                }
            ]
        };
        myChart.setOption(option);
    </script>
    <script type="text/javascript">
        var myChart = echarts.init(document.getElementById('pmrmidd'));
        option = {
            color: ['#f1ff00', '#00c1ff', '#61a0a8', '#d48265', '#91c7ae', '#749f83', '#ca8622', '#bda29a', '#6e7074', '#546570', '#c4ccd3'],
            // backgroundColor: 'rgba(1,202,217,.2)',
            grid: {
                left: 20,
                right: 20,
                top: 30,
                bottom: 30
            },
            radar: {
                name: {
                    textStyle: {
                        fontSize: 10,
                        color: 'rgba(255,255,255,.8)'
                    }
                },
                splitLine: {
                    lineStyle: {
                        color: [
                            'rgba(1,202,217,.01)', 'rgba(1,202,217,.01)'
                        ].reverse()
                    }
                },
                splitArea: {
                    show: false
                },
                axisLine: {
                    lineStyle: {
                        color: 'rgba(1,202,217,.7)'
                    }
                },
                indicator: [
                    { name: '分类1', max: 6500 },
                    { name: '分类2', max: 16000 },
                    { name: '分类3', max: 30000 },
                    { name: '分类4', max: 44000 }
                ]
            },
            series: [{
                name: '',
                type: 'radar',
                radius: [5, 100],
                center: ['50%', '50%'],
                data: [
                    {
                        value: [4300, 10000, 28000, 19000],
                        name: ''
                    },
                    {
                        value: [5000, 14000, 22000, 41000],
                        name: ''
                    }
                ]
            }]
        };
        myChart.setOption(option);
    </script>
    <script src="~/js/Report.min.js" asp-append-version="true"></script>
    @if ((await AuthorizationService.AuthorizeAsync(User, null, new PermissionAuthorizationRequirement(IntelligentMonitor.Authorization.Permissions.UserEditor))).Succeeded)
    {
        <script src="~/js/jquery.dad.min.js"></script>
        <script>
            $('.content .layui-row').dad();
        </script>
    }
</body>
</html>